<template>
<div>
  <el-menu  class="el-menu-demo" mode="horizontal" active-text-color="#20a0ff"  :default-active="$route.path" router >
    <el-menu-item v-for="(item, key) in paths" :key="key" :index="item.path" v-show="item.show">{{item.name}}</el-menu-item> 
  </el-menu>
  <router-view class="router-view-2"></router-view>
</div>
</template>

<script>
import hello from "../../../../components/hello.vue";
import ebus from "../../../../libs/ebus";
import { mapState } from "vuex";
import _ from 'lodash';
export default {
  components: {
    hello
  },
  computed:{    
    ...mapState(["kvm"]),
    paths(){
      var kvm = this.kvm;
      var paths = [
        { path: "/kvm/comsetting", name: this.$t('message.kvms.comsetting'), show: true },
        { path: "/kvm/irsetting", name: this.$t('message.kvms.irsetting'), show: false },
        { path: "/kvm/kvmDetail", name: this.$t('message.kvms.kvmDetail'), show: false},
      ]
      if(kvm.hideComSetting){
        paths[0].show = false;
      }
      if(kvm.hideIrOutSetting){
        paths[1].show = false;
      }
      return paths;
    },
    firstPath(){
      var res = _.find(this.paths, item => {
        return item.show == true
      })
      if(res){
        return res.path
      } else {
        return "/kvm/comsetting"
      }
    }
  },
  created() {
    if(!this.paths[0].show && this.paths[1].show){
      this.$router.push('/kvm/irsetting')
    } else if(!this.paths[0].show && !this.paths[1].show){
      this.$router.push('/kvm/kvmDetail')
    } 
    // this.$router.beforeEnter((to, from, next) => {
    //   debugger
    //   if(to.path == '/kvm/comsetting' && this.paths[0].show == false){
    //     next({
    //       path: this.firstPath
    //     })
    //   }
    //   else {
    //     next()
    //   }
      
    // })
  },
  data() {
    return {
      paths1: [
        { path: "/kvm/comsetting", name: this.$t('message.kvms.comsetting'), show: true },
        { path: "/kvm/irsetting", name: this.$t('message.kvms.irsetting'), show: true },
        { path: "/kvm/kvmDetail", name: this.$t('message.kvms.kvmDetail'), show: true},
      ]
    };
  },
  methods:{    
    getFirstPath(){

    }
  }
};
</script>
<style>
@import "../../../../style/common.css";
</style>


